<template>
  <div>
    <el-menu
      :default-active="this.$route.path"
      class="el-menu-vertical-demo"
      background-color="#2d3a4b"
      text-color="#fff"
      :router="true"
    >
      <el-menu-item index="/">
        <i class="el-icon-menu" style="color: #fff"></i>
        <span slot="title">首页</span>
      </el-menu-item>
      <el-submenu index="2">
        <template slot="title">
          <i class="el-icon-document-remove" style="color: #fff"></i>
          <span>查询功能选项</span>
        </template>
        <el-menu-item index="/function_statis">产能统计</el-menu-item>
        <el-menu-item index="/function_produce">单一产品缺陷分析</el-menu-item>
        <el-menu-item index="/function_table">缺陷数据统计</el-menu-item>
        <el-menu-item index="/function_serch">产品履历查询</el-menu-item>
        <el-menu-item index="/function_drawback">缺陷密集性分析</el-menu-item>
        <el-menu-item index="/function_facility">设备密集性分析</el-menu-item>
        <el-menu-item index="/function_staff">复判人员产能统计</el-menu-item>
        <el-menu-item index="/function_capacity">缺陷对比分析</el-menu-item>
        <el-menu-item index="/function_glo">产能对比分析</el-menu-item>
        <el-menu-item index="/function_query">复判人员产密集性统计</el-menu-item>
      </el-submenu>

      <el-submenu index="4">
        <template slot="title">
          <i class="el-icon-star-on" style="color: #fff"></i>
          <span>实时看板选项</span>
        </template>
        <el-menu-item @click="ren_item">个人信息</el-menu-item> 
        <el-menu-item @click="function_warning">连续预警</el-menu-item>
        <el-menu-item  @click="function_imgwarning"
          >实时连续密集性预警</el-menu-item
        >
        <el-menu-item @click="onclick">实时看板</el-menu-item>
      </el-submenu>
    </el-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  mounted() {},
  methods: {
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },
    onclick() {
      let router = this.$router.resolve({
        path: "/real-time",
      });

      window.open(router.href);
    },
    ren_item() {
      let router = this.$router.resolve({
        path: "/ren_item",
      });

      window.open(router.href);
    },

    function_warning(){
      let router = this.$router.resolve({
        path:'/function_warning'
      })
       window.open(router.href);
    },
    function_imgwarning(){
      let router = this.$router.resolve({
        path:"/function_imgwarning"
      })
      window.open(router.href)
    }
  },
};
</script>

<style scoped>
.hader_left {
  width: 230px;
  /* height:400px; */
  /* border: 1px solid yellow; */
  box-shadow: 0px 0px 0px 1px gainsboro;
  padding: 10px;
}
.el-menu {
  border-right: none;
}
</style>